---
description: How to build a production version of your browser extension.
---

import { Callout } from "nextra-theme-docs"

# Create a Production Build

To create a production bundle for distribution, run:

```sh
pnpm build
# OR
npm run build
```

## Generating a zip bundle

To create a production zip bundle ready to be uploaded to the web stores, use the `package` command:

```sh
pnpm package
# OR
npm run package
```

If you would like to combine the building and packaging process, use the `--zip` flag with the `build` command instead:

```sh
pnpm build --zip
# OR
npm run build -- --zip
```

## With a specific target

The `build` command accepts a `--target` flag in the form of `<browser-name>-<manifest-version>`. Use it to specify a browser and manifest version combination to build for:

```sh
plasmo build --target=firefox-mv2
```

The final bundle will be available in the `build/firefox-mv2-prod` directory. You may use any pairs of target browser and manifest version.

For a list of officially supported targets, [visit this link](./faq#what-are-the-officially-supported-browser-targets). These targets are recognized by the bundler, which will automatically handle some vendor-specific behavior for you.

The `--target` flag also enables you to:

- Use a target-specific environment file: `.env.<browser-name>`
- Use a target-specific entry files: e.g `popup.<browser-name>.tsx`
- Set the process.env.PLASMO_BROWSER to `<browser-name>`

The third feature works with deadcode elimination. Thus the following code:

```ts
if (process.env.PLASMO_BROWSER === "safari") {
  console.log("A")
} else {
  console.log("B")
}
```

Will be trimmed down to `console.log("A")` if the target is `safari-mv3`.

## With a custom tag

Plasmo uses the `prod` tag for your production build. You can use the `--tag` flag to change this behavior:

```sh
plasmo build --tag=staging
```

The command above will:

- Create the bundle in the `build/chrome-mv3-staging` directory
- Set the `process.env.PLASMO_TAG` environment variables to `staging`
- Parse and prioritize [`.env.staging` or `.env.staging.local`](/framework/env#bundle-specific-env) if any exist

## With source maps

By default, Plasmo does not generate source maps for your production bundle. However, you can use the `--source-maps` flag to change this behavior:

```sh
plasmo build --source-maps
```

## Bundle Buddy

If you'd like to analyze your bundle, you can use the `--bundle-buddy` flag, combined with `--source-maps` to generate a [Bundle Buddy](https://bundle-buddy.com/) report:

```sh
plasmo build --source-maps --bundle-buddy
```

## Optimization

To create a bundle with minification disabled:

```
plasmo build --no-minify
```

To create an import-optimized build where the bundle deduplicate and hoist your dependency to the top of the bundle:

```
plasmo build --hoist
```

Note that hoisting can potentially break your dependency, especially those that import dynamic dependency via a plugin system. However, hoisting can significantly improve the bundling speed and reduce the size of your bundle.

You may combine these flags as needed.
